
$(function (){

  // 渲染页面
  // 1-渲染出侧边栏 
  // 2-点击侧边栏的列表项在右边的内容区域，渲染出对应的二级分类

   // 1-渲染出侧边栏 
   $.ajax({
     type:"get",
     url:"/category/queryTopCategory",
     dataType:'json',
     success:function (res){
       console.log(res);
       $(".cate-aside ul").html(template("tmp-one",res));
        // 该页面打开就是选中侧边栏第一栏并显示其二级分类的
        renderSecondCategory(res.rows[0].id);
     }
   })
    // 2-点击侧边栏的列表项在右边的内容区域，渲染出对应的二级分类
    // => 1-获取一级分类的id 
    // => 2-根据id，渲染出对应的二级分类
    // 多次渲染 => 封装
     // => 2-根据id，渲染出对应的二级分类
    function renderSecondCategory(id){
       $.ajax({
         type:'get',
         url:'/category/querySecondCategory',
         data:{id:id},
         dataType:'json',
         success:function (res){
           console.log(res);
           $(".cate-info ul").html(template("tmp-two",res));
         }
       })
    }
   
  // => 1-获取一级分类的id 
    $(".cate-aside ul").on("click","li",function(){
      // 侧边栏颜色样式排他
      $(this).addClass("li-click").siblings().removeClass("li-click");
      renderSecondCategory($(this).data('id'));
      console.log($(this).data('id'));
    })
})